import React from 'react';
import { Icon } from './Icon';
import styled from 'styled-components';

const Wrapper = styled.section`
  margin: 20vh auto 0;
  text-align: center;
  .icon {
    width: 100px;
    height: 100px;
    fill: #999999;
  }
  > p {
    margin-top: 10px;
    color: #999999;
  }
`;

export const Empty = () => {
  return (
    <Wrapper>
      <Icon name="empty" />
      <p>暂时还没有记录. 快去记一笔吧~</p>
    </Wrapper>
  );
};
